<div data-role="collapsible" id="shipping" data-collapsed="true">
    <h3 class="cart-heading"><?php echo $heading_title; ?></h3>
    <div class="cart-content" data-role="fieldcontain">
        <p><?php echo $text_shipping; ?></p>
        <label for="ship_country"><span class="required">*</span> <?php echo $entry_country; ?></label>
        <select data-native-menu="true" id="ship_country" name="country_id" onchange="$('select[name=\'zone_id\']').load('index.php?route=total/shipping/zone&country_id=' + this.value + '&zone_id=<?php echo $zone_id; ?>');">
            <option value=""><?php echo $text_select; ?></option>
            <?php foreach ($countries as $country) { ?>
                <?php if ($country['country_id'] == $country_id) { ?>
                    <option value="<?php echo $country['country_id']; ?>" selected="selected"><?php echo $country['name']; ?></option>
                <?php } else { ?>
                    <option value="<?php echo $country['country_id']; ?>"><?php echo $country['name']; ?></option>
                <?php } ?>
            <?php } ?>
        </select><br />

        <label for="ship_zone_id"><span class="required">*</span> <?php echo $entry_zone; ?></label>
        <select data-native-menu="true" id="ship_zone_id" name="zone_id"></select><br />

        <label for="ship_postcode"><span class="required">*</span> <?php echo $entry_postcode; ?></label>
        <input id="ship_postcode" type="text" name="postcode" value="<?php echo $postcode; ?>" /><br />
        <a id="button-quote" data-role="button" class="button" rel="external"><?php echo $button_quote; ?></a>

        <div id="quote"></div>
        <input type="hidden" name="shipping_method" value="<?php echo $code; ?>" />
    </div>
</div>
<script type="text/javascript"><!--
    $('#button-quote').bind('click', function() {
        $.ajax({
            type: 'POST',
            url: 'index.php?route=total/shipping/quote',
            data: 'country_id=' + $('select[name=\'country_id\']').val() + '&zone_id=' + $('select[name=\'zone_id\']').val() + '&postcode=' + encodeURIComponent($('input[name=\'postcode\']').val()),
            dataType: 'json',		
            beforeSend: function() {
                $('.success, .warning').remove();
                $('#button-quote').attr('disabled', true);
                $('#button-quote').after('<span class="wait">&nbsp;<img src="catalog/view/theme/tablet/image/loading.png" alt="" /></span>');
            },
            complete: function() {
                $('#button-quote').attr('disabled', false);
                $('.wait').remove();
            },		
            success: function(json) {
                $('.error').remove();
                $('.wait').remove();

                if (json['redirect']) {
                    location = json['redirect'];
                }
						
                if (json['error']) {
                    if (json['error']['warning']) {
                        $('#basket').before('<div class="warning">' + json['error']['warning'] + '</div>');
                    }
				
                    if (json['error']['country']) {
                        $('#shipping select[name=\'country_id\'] + br').after('<div class="error">' + json['error']['country'] + '</div>');
                    }	
				
                    if (json['error']['zone']) {
                        $('#shipping select[name=\'zone_id\'] + br').after('<div class="error">' + json['error']['zone'] + '</div>');
                    }
				
                    if (json['error']['postcode']) {
                        $('#shipping input[name=\'postcode\']').after('<div class="error">' + json['error']['postcode'] + '</div>');
                    }					
                }
			
                if (json['shipping_methods']) {
                    html  = '<br />';
                    html += '<fieldset data-role="controlgroup">';
                    for (i in json['shipping_methods']) {
				
                        if (!json['shipping_methods'][i]['error']) {
                            for (j in json['shipping_methods'][i]['quote']) {
							
                                if (json['shipping_methods'][i]['quote'][j]['code'] == $('input[name=\'shipping_method\']').attr('value')) {
                                    html += '<input type="radio" name="shipping_method" value="' + json['shipping_methods'][i]['quote'][j]['code'] + '" id="' + json['shipping_methods'][i]['quote'][j]['code'] + '" checked="checked" />';
                                } else {
                                    html += '<input type="radio" name="shipping_method" value="' + json['shipping_methods'][i]['quote'][j]['code'] + '" id="' + json['shipping_methods'][i]['quote'][j]['code'] + '" />';
                                }
								
                                html += '  <label for="' + json['shipping_methods'][i]['quote'][j]['code'] + '">' + json['shipping_methods'][i]['quote'][j]['title'] + ' - ' + json['shipping_methods'][i]['quote'][j]['text'] + '</label>';
                            }
                        } else {
                            html += '  <div class="error">' + json['shipping_methods'][i]['error'] + '</div>';
                        }
                    }
				
                    html += '</fieldset>';
                    html += '<br /><a id="button-shipping" data-role="button" class="button" rel="external"><?php echo $button_shipping; ?></a>';				
		
                    $('#quote').html(html);
                    $("#quote input[type='radio']").checkboxradio();
                    $("#quote input[type='radio']").checkboxradio("refresh");
                    $("#quote fieldset").controlgroup("refresh");
                    $("#quote .button").button();
                    	
                    $('#quote').slideDown('slow');
                }
            }
        });
    });

    $('#button-shipping').live('click', function() {
        $.ajax({
            type: 'POST',
            url: 'index.php?route=total/shipping/calculate',
            data: 'shipping_method=' + $('input[name=\'shipping_method\']:checked').attr('value'),
            dataType: 'json',		
            beforeSend: function() {
                $('.warning').remove();
                $('#button-shipping').attr('disabled', true);
                $('#button-shipping').after('<div class="wait">&nbsp;<img src="catalog/view/theme/tablet/image/loading.png" alt="" /></div>');
            },
            complete: function() {
                $('#button-shipping').attr('disabled', false);
                $('.wait').remove();
            },		
            success: function(json) {
                if (json['error']) {
                    $('#shipping').before('<div class="warning">' + json['error'] + '<img src="catalog/view/theme/tablet/image/close.png" alt="" class="close" /></div>');
                }
			
                if (json['redirect']) {
                    location = json['redirect'];
                }
            }
        });
    });
    //--></script> 
<script type="text/javascript"><!--
    $('select[name=\'zone_id\']').load('index.php?route=total/shipping/zone&country_id=<?php echo $country_id; ?>&zone_id=<?php echo $zone_id; ?>');
    //--></script> 